In an earlier lesson, you
created a small simple website using HTML.
You will now alter the website so that it uses CSS for formatting
purposes. You will then create three different
CSS files that provide your site with three different looks. By simply switching the CSS files used, you
will instantly switch the look.
ORGANIZING
CSS FILES
In the end, you need 3
different CSS documents. They should be
called:
To simplify the process of
switching over your website to work with a different look, we will also have
fourth css file called:
All html documents should
link to the current.css file. At any
time, if you want to switch to a different look, you just copy the content from
that look’s css file into current.css.
(The more efficient way would be to duplicate the css file and rename it
current.css.)
SUGGESTED
APPROACH
Communication (5 marks)
·
Student will show the
site with the 3 looks.
·
Student is able to
efficiently switch from one look to another.
·
Student is confident
with what he/she is doing while doing demonstration.
·
Student uses proper
terminology.
Application (5 marks)
·
HTML document contains
no formatting – so only div tags, no p, h1, b tags...
·
CSS is used to create
the looks.
·
No
difficulties/problems with the CSS coding.
·
The website is fully
functional.
Thinking (5 marks)
·
Student makes use of
resource (w3schools site) to discover new CSS functionality.
·
Student is original in
use of CSS.
·
Looks to vary
considerably – not just different colours.
Knowledge (5 marks)
·
A quiz will be given to
cover the Knowledge part.